<template>
  <van-nav-bar
    title="搜索结果页面"
    left-text="返回"
    left-arrow
    @click-left="$router.back()"
    fixed
    placeholder
  />
  <van-row :gutter="[20, 20]" class="list">
    <van-col
      span="12"
      v-for="item in listArr"
      :key="item.proid"
      class="list-item"
      @click="$router.push('/detail?proid=' + item.proid)"
    >
      <div class="van-ellipsis">{{ item.proname }}</div>
      <img :src="item.img1" alt="" />
      <div class="van-ellipsis">{{ item.desc }}</div>
      <div>价格:{{ item.originprice }}</div>
    </van-col>
  </van-row>
</template>

<script setup>
import { ref } from 'vue'
import axios from 'axios'
import { useRoute } from 'vue-router'
let route = useRoute()
let listArr = ref([])
//获取搜索参数列表
let searchParamsAPI = ref('http://localhost:3001/api/pro/search') 
async function getData() {
  let r = await axios.get(searchParamsAPI.value, {
    params: { count: 1, limitNum: 15, keyword: route.query.keyword },
  })
  console.log(r.data.data)
  listArr.value = r.data.data
}
getData()
</script>

<style scoped>
.list {
  width: 355px;
  margin: 0 auto;
}

.list-item img {
  width: 100%;
}
</style>
